<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.prime.com.tr/ui">

    <body>
        <ui:composition template="./requestQueue.xhtml">

            <ui:define name="tabContent">

                <!--        <ui:composition template="./template.xhtml">
                
                            <ui:define name="title">
                                Xử lý yêu cầu
                            </ui:define>
                
                            <ui:define name="content">-->
                <h:form id="form">
                    <h:panelGrid columns="2">
                        <p:selectBooleanCheckbox value="#{requestQueueBean.nullServiceOnly}">  
                            <p:ajax update="requestTable" listener="#{requestQueueBean.toggleView()}"/>  
                        </p:selectBooleanCheckbox> 
                        Chỉ hiển thị các yêu cầu sai cú pháp
                    </h:panelGrid>

                    <h:dataTable id="requestTable" value="#{requestQueueBean.list}" var="item" rows="250" border="1" cellspacing="0" cellpadding="5">
                        <f:facet name="header">  
                            <div align="left">
                                <p:commandButton ajax="false" value="Cập nhật" image="ui-icon ui-icon-check" action="#{requestQueueBean.updateAll()}"/>  
                            </div>
                        </f:facet>
                        <h:column>
                            <f:facet name="header">ID</f:facet>
                                #{item.requestId}
                        </h:column>
                        <h:column>                             
                            <f:facet name="header">Nội dung</f:facet>
                            <h:inputText value="#{item.requestDetail}" style="width: 300px"/>
                        </h:column>
                        <h:column >                             
                            <f:facet name="header">Giờ nhận</f:facet>
                            <h:outputText value="#{item.receivedTime}">
                                <f:convertDateTime pattern="dd/MM/yyyy HH:mm:ss" timeZone="Asia/Saigon"/>
                            </h:outputText>
                        </h:column>
                        <h:column>                             
                            <f:facet name="header">Đầu số</f:facet>
                                #{item.cpNumber}
                        </h:column>
                        <h:column>                             
                            <f:facet name="header">Số gửi đến</f:facet>
                            <p:commandLink value="#{item.msisdn}" action="#{requestQueueHistBean.searchByMsisdn(item.msisdn)}" 
                                           update="form:historyTable form:diagDescription" onsuccess="historyDialog.show();"/>
                        </h:column>
                        <h:column>                             
                            <f:facet name="header">Giờ kiểm tra cuối</f:facet>
                            <h:outputText value="#{item.lastCheckTime}">
                                <f:convertDateTime pattern="dd/MM/yyyy HH:mm:ss" timeZone="Asia/Saigon"/>
                            </h:outputText>
                        </h:column>
                        <h:column>
                            <p:commandButton value="Xong" action="#{requestQueueBean.prepareSetComplete(item.requestId)}" onsuccess="setCompletedDialog.show()"
                                             update="confirmForm:pnlSetComplete"/>
                        </h:column>
                        <f:facet name="footer">  
                            <div align="left">
                                <p:commandButton ajax="false" value="Cập nhật" image="ui-icon ui-icon-check" action="#{requestQueueBean.updateAll()}"/>  
                            </div>
                        </f:facet>
                    </h:dataTable>

                    <!-- History Dialog -->
                    <p:dialog id="diag" width="800" hideEffect="explode" widgetVar="historyDialog" 
                              modal="true" header="Lịch sử nhắn tin" >  
                        <b>
                            <h:outputText id="diagDescription" value="Lịch sử nhắn tin của thuê bao #{requestQueueHistBean.selectedMsisdn}"/>
                        </b>
                        <br/>

                        <p:dataTable  id="historyTable" value="#{requestQueueHistBean.list}" var="item" 
                                      paginator="#{requestQueueHistBean.list.size()>10}" rows="10"
                                      emptyMessage="Không có lịch sử của thuê bao này">

                            <p:column headerText="Nội dung" sortBy="#{item.requestDetail}">
                                #{item.requestDetail}
                            </p:column>
                            <p:column headerText="Giờ nhận" sortBy="#{item.receivedTime}">
                                <h:outputText value="#{item.receivedTime}">
                                    <f:convertDateTime pattern="dd/MM/yyyy HH:mm:ss" timeZone="Asia/Saigon"/>
                                </h:outputText>
                            </p:column>
                            <p:column headerText="Đầu số" sortBy="#{item.cpNumber}">
                                #{item.cpNumber}
                            </p:column>
                            <p:column headerText="Dịch vụ" sortBy="#{item.serviceName}">
                                #{item.serviceName}
                            </p:column>
                            <p:column headerText="Nội dung cũ" sortBy="#{item.oldContent}">
                                #{item.oldContent}
                            </p:column>

                        </p:dataTable>
                        <p:commandButton value="Đóng" onclick="historyDialog.hide()" type="button" />   

                    </p:dialog> 
                </h:form>
                
                <p:dialog id="setCompleteDiag" width="800" hideEffect="explode" widgetVar="setCompletedDialog" 
                          modal="true" header="Hủy tin nhắn" >  
                    <h:form id="confirmForm">
                        <h:panelGrid id="pnlSetComplete" columns="5">
                            <div align="left">
                                <b> Đưa trạng thái của tin nhắn về "COMPLETE":</b> <br/>
                                <b> Nội dung    : </b>#{requestQueueBean.toBeCompletedRequest.requestDetail}<br/>
                                <b> Giờ nhận    : </b>#{requestQueueBean.toBeCompletedRequest.receivedTime}<br/>
                                <b> Đầu số      : </b>#{requestQueueBean.toBeCompletedRequest.cpNumber}<br/>
                                <b> Nội dung cũ : </b>#{requestQueueBean.toBeCompletedRequest.oldContent}<br/>
                                <br/>

                            </div>
                        </h:panelGrid>
                        <h:panelGrid columns="5">
                            <b> Nhập tên bạn để xác nhận: </b><p:inputText value="#{requestQueueBean.actionCommitter}" required="true"/><br/>
                            <h:commandButton value="Xong" action="#{requestQueueBean.setCompleted(requestQueueBean.toBeCompletedRequest.requestId)}" />
                        </h:panelGrid>
                    </h:form>
                </p:dialog> 
            </ui:define>

        </ui:composition>

    </body>
</html>
